  @import './variables.scss';

  .admin-module{ margin: 30px 0; }
  .admin-operate{ 
    width: 100%; margin-bottom: 15px; text-align: left;
    >*{
      margin-right: 10px; margin-bottom: 10px;
    }
    select{
      height: 22px; border-radius: 11px; padding: 0 10px; cursor: pointer; max-width: 120px;
      &:focus{
        outline: 0;
      }
      option{
        max-width: 100px;
        @include text-over;
      }
    }
    button{
      line-height: 22px; border: 0; background: $hl-color; color: $bg-color; border-radius: 11px; padding: 0 15px;
    }
  }
  .admin-table{ 
    width: 100%;
    th, td{
      border: 1px solid $border-color; text-align: center; height: 40px; padding: 5px;
    }
    .operates{
      display: inline-block; width: 0; height: 100%; position: relative; left: -121px;
      div{
        width: 120px; height: 100%; background: $hl-color; padding: 0 15px; display: none;
        @include flex-align-center;
        button{
          border: 0; background: $hl-color; color: #fff; margin: 0 auto;
          &:hover{
            color: $second-hl-color;
          }
        }
      }
    }
    tr:hover .operates div{
      @include flex;
    }
  }

  .modify{
    width: 100%; height: calc(100% - 50px);
  }
  .modify-form{
    margin: 0 auto; padding: 0 15px; width: 600px; max-width: 100%; overflow-y: auto; text-align: left; margin-bottom: 70px;
    .modify-header{
      border-bottom: 1px solid #bbb;
      h3{
        text-align: center; padding-bottom: 10px;
      }
    }
    .modify-name{ 
      line-height: 20px; padding-top: 15px; color: #777; 
    }
    .modify-val{ 
      margin-top: 5px;
      & li{
        display: inline-block; margin-right: 5px;
        input{
          margin-right: 5px;
        }
      }
    }
  }
  .modify-operate{
    text-align: center; padding: 15px; border-top: 1px solid #aaa; position: fixed; bottom: 0; width: 100%; background: $bg-color;
    >input{
      width: 80px;
      &.submit{
        background: $hl-color; border: 1px solid $hl-color; color: #fff; margin-right: 15px;
      }
    }
  }
  .modify-prompt{
    position: absolute; top: calc(50% - 40px); left: calc(50% - 100px); width: 200px;
    height: 56px; background: rgba(30, 30, 30, .8);
    h3{ 
      color: #fff; text-align: center; line-height: 56px;
    }
  }